<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta http-equiv="X-UA-Compatible" content="edge">
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
<!--     <script src="webpages/wx/pzsw/js/fastclick.js"></script> -->
    <title>屏障思维</title>
    <script>

        ;(function(){
            //缩放比例
            var defaultW = 750 ;
            if (/Android (d+.d+)/.test(navigator.userAgent)) {
                var version = parseFloat(RegExp.$1);
                if (version > 2.3) {
                    var phoneScale = parseInt(window.screen.width) / defaultW;
                    document.write('<meta name="viewport" content="width='+defaultW+'", minimum-scale = ' + phoneScale + ', maximum-scale = ' + phoneScale + ', target-densitydpi=device-dpi">');
                } else {
                    document.write('<meta name="viewport" content="width='+defaultW+'">');
                }
            } else {
                document.write('<meta name="viewport" content="width='+defaultW+', user-scalable=no">');
            }
        })();

    </script>
    <link rel="stylesheet" href="webpages/wx/pzsw/css/reset2.css">
    <link rel="stylesheet" href="webpages/wx/pzsw/css/style2.css">
    
</head>
<body id="nextContainer" style="overflow: hidden;z-index:999">
    <div class="pack-flow">
         <p class="title-p"><span class="number-span">4</span><span class="title-span">风险管控示意图</span></p>
        <div class="flow-tree">
            <div>
                <div class="flow-tree-title">
                    <p>第二步</p>
                    <p>导致此因素引发事故的原因</p>
                </div>
                <div class="flow-tree-1">
                    <div>
                        <div class="cheek-pack"><p class="mediacy-p">A.${pzsw.questionReason1!}</p></div>
                    </div>
                    <div>
                        <div class="cheek-pack"><p class="mediacy-p">B.${pzsw.questionReason2!}</p></div>
                    </div>
                    <div>
                        <div class="cheek-pack"><p class="mediacy-p">C.${pzsw.questionReason3!}</p></div>
                    </div>
                </div>
            </div>
            <div>
            	
                <div class="flow-tree-title">
                    <p>第三步</p>
                    <p>每个原因的解决方案</p>
                </div>
                <div class="flow-tree-2">
                    <div class="tree-2-1">
                        <div onclick="clickA('reason1Solve1')">
                            <div class="cheek-tree-2">
                            	<p id="reason1Solve1" class="mediacy-p <#if pzsw.reason1Solve1.choose??&&pzsw.reason1Solve1.choose=='true'>text-red</#if>">${(pzsw.reason1Solve1.name)!}</p>
                            </div>
                        </div>
                        <div onclick="clickA('reason1Solve2')">
                            <div class="cheek-tree-2">
                            	<p id="reason1Solve2" class="mediacy-p <#if pzsw.reason1Solve2.choose??&&pzsw.reason1Solve2.choose=='true'>text-red</#if>">${(pzsw.reason1Solve2.name)!}</p>
                            </div>
                        </div>
                    </div>
                    <div class="tree-2-2">
                       <div onclick="clickA('reason2Solve1')">
                            <div class="cheek-tree-2">
                            	<p id="reason2Solve1" class="mediacy-p <#if pzsw.reason2Solve1.choose??&&pzsw.reason2Solve1.choose=='true'>text-red</#if>">${(pzsw.reason2Solve1.name)!}</p>
                            </div>
                        </div>
                       <div onclick="clickA('reason2Solve2')">
                            <div class="cheek-tree-2">
                            	<p id="reason2Solve2" class="mediacy-p <#if pzsw.reason2Solve2.choose??&&pzsw.reason2Solve2.choose=='true'>text-red</#if>">${(pzsw.reason2Solve2.name)!}</p>
                            </div>
                        </div>
                    </div>
                    <div class="tree-2-3">
                        <div onclick="clickA('reason3Solve1')">
                            <div class="cheek-tree-2">
                            	<p id="reason3Solve1" class="mediacy-p <#if pzsw.reason3Solve1.choose??&&pzsw.reason3Solve1.choose=='true'>text-red</#if>">${(pzsw.reason3Solve1.name)!}</p>
                            </div>
                        </div>
                        <div onclick="clickA('reason3Solve2')">
                            <div class="cheek-tree-2">
                            	<p id="reason3Solve2" class="mediacy-p <#if pzsw.reason3Solve2.choose??&&pzsw.reason3Solve2.choose=='true'>text-red</#if>">${(pzsw.reason3Solve2.name)!}</p>
                            </div>
                        </div>
                    </div>
                </div>
            	<form id="selectForm">
 	                            	<input type="hidden" value="${(pzsw.reason1Solve1.choose)!'false'}" name="reason1Solve1" />
 	                            	<input type="hidden" value="${(pzsw.reason1Solve2.choose)!'false'}" name="reason1Solve2" />
 	                            	<input type="hidden" value="${(pzsw.reason2Solve1.choose)!'false'}" name="reason2Solve1" />
 	                            	<input type="hidden" value="${(pzsw.reason2Solve2.choose)!'false'}" name="reason2Solve2" />
 	                            	<input type="hidden" value="${(pzsw.reason3Solve1.choose)!'false'}" name="reason3Solve1" />
 	                            	<input type="hidden" value="${(pzsw.reason3Solve2.choose)!'false'}" name="reason3Solve2" />
            	
            	</form>
            </div>
            <div>
                <div class="flow-tree-title">
                    <p>第一步</p>
                    <p>可能导致不良后果/事故的因素</p>
                </div>
                <div class="flow-tree-3">
                    <div><p class="mediacy-p">${pzsw.questionName!}</p></div>
                    <div><p class="mediacy-p">产生的后果</p></div>
                </div>
            </div>
        </div>
        <div class="foot-text">
             <p>第四步&nbsp; <span class="font-w-red">请在第三步点击选择三个解决方案</span>（从方案是否相互独立、是否可实施、是否经济等方面考虑）。</p>
        </div>
		<div style="position: fixed;left: 0;width: 100%;text-align: center;bottom: 100px;"><img src="webpages/wx/pzsw/images/arrow2.png" style="width: 80px;display: inline-block;margin: auto;"></div>		
        
        <div class="connect-line-1-1"></div>
        <div class="connect-line-1-2"></div>
        <div class="connect-line-1-3"></div>
        <div class="connect-line-2-1"></div>
        <div class="connect-line-2-2"></div>
        <div class="connect-line-2-3"></div>
        <div class="connect-line-3-1"></div>
        <div class="connect-line-3-2"></div>
        <div class="connect-line-3-3"></div>
    </div>
        <#include "footer.html">
<!--     <script src="webpages/wx/pzsw/js/fastclick.js"></script> -->
    
    <script type="text/javascript">
    $(function(){
//     	FastClick.attach(document.body);  
//         new FastClick(document.body);

    })
    
    
    
	// 先要对监听的DOM进行一些初始化
	var hammer = new Hammer(document.getElementById("nextContainer"));
	hammer.get('swipe').set({direction:Hammer.DIRECTION_ALL});
	// 然后加入相应的回调函数即可
	hammer.on('swipeup',swipeEvent);
	hammer.on('swipedown',swipeEvent);
	var count = 0;
	function clickA(id) {
// 		alert(id);
		if($('#'+id).hasClass('text-red')) {
			$('#'+id).removeClass('text-red');
			count--;
			$("input[name='"+id+"']").val('false');
		}else {
			$('#'+id).addClass('text-red');
			count++;
			$("input[name='"+id+"']").val('true');
		}
		
	}
	
	function swipeEvent(evt) {
// 		alert(111);
		if(evt.type=='swipedown') {
			window.location.href='pzsw.action?page=content2-3-1';
		} else if(evt.type=='swipeup') {
			var chooseCount = 0;
			$('#selectForm input').each(function() {  
		         if (this.value == 'true') {  
		        	 chooseCount++;
		         }  
		    });
			if(chooseCount<3) {
				alert('请至少选择3项！');
				return;
			}
			//提交信息
			var formData = $('#selectForm').serialize();
// 			alert(formData);
			$.ajax({
				type : "POST",
				url : "pzsw.action?submit",
				data : formData, //序列化               
				error : function(request) { // 设置表单提交出错 
					alert('提交错误'); //登录错误提示信息
				},
				success : function(data) {
					var d = data;//$.parseJSON(data);
					if (d.success) {
						window.location.href='pzsw.action?page=content2-5';
					} else {
						alert(d.msg)
					}
					
				}
			});
		}
		
	}
	</script>
</body>
</html>